@extends('layouts.userctl')
@section('content')
<style>
	.layui-card-header {
		margin-top: 15px;
	}

	/*.layui-table-cell {
		display: flex;
		justify-content: center;
		align-items: center;
	}*/

	.userstatus {
		margin-left: 6px;
		color: #888;
		font-size: 14px;
	}

	.layui-table-tips-c::before {
		position: absolute !important;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0px !important;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.laytable-cell-1-0-0 {
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>
{{csrf_field()}}
<div class="layuimini-container">
	<div class="layuimini-main">
		<div style="margin: 10px 10px 10px 10px" id="btn">
			<form class="layui-form layui-form-pane" action="">
				<div class="layui-form-item">
					<div class="layui-inline" style="float: right;">
						<!--注意此处button标签里的type属性-->
						<button type="button" class="layui-btn layui-btn-normal" lay-submit id="searchbtn"
							lay-filter="data-search-btn"><i class="layui-icon layui-icon-search"></i>搜 索</button>
					</div>
					<div class="layui-inline" style="float: right;">
						<label class="layui-form-label">关键字</label>
						<div class="layui-input-inline">
							<!--注意此处input标签里的id-->
							<input class="layui-input" name="keyword" id="keywordinput">
						</div>
					</div>
					<div class="layui-inline" style="float: left;">
						@if ($role=='admin' || $role=='community_admin')
						<a class="layui-btn layui-btn-normal" href="{{route('admin.user.adduser')}}"
							style="color: #fff;"><i class="layui-icon layui-icon-addition"></i>添加工作人员</a>
						@endif
						
						@if ($role=='admin')
						<a class="layui-btn layui-btn-normal"
							href="{{route('admin.department.addstreetuser',array('type_id'=>2))}}"
							style="color: #fff;"><i class="layui-icon layui-icon-addition"></i>添加社区管理员</a>
						@endif
					</div>
				</div>
			</form>
		</div>
		<!--注意此处table标签里的id-->
		<table class="layui-table layui-hide" id="dataTable" lay-filter="dataTable"></table>
	</div>
</div>

<!-- <div class="layui-card">
	<div class="layui-card-header layuiadmin-card-header-auto">
		<a class="layui-btn layui-btn-normal" href="{{route('admin.user.adduser')}}" style="color: #fff;">新增用户</a>
	</div>
	<div class="layui-card-body">
		<table id="dataTable" lay-filter="dataTable"></table>
	</div>
</div> -->

<script>
	layui.use(['layer', 'table', 'form'], function() {
		var layer = layui.layer
		var form = layui.form
		var table = layui.table
		//用户表格初始化
		var dataTable = table.render({
			elem: '#dataTable',
			height: 'full',
			limit: 10,
			limits: [10, 20],
			url: '{{ route("admin.user.data") }}',
			page: true,
			cols: [
				[ //表头
					{ title: '序 号',templet: function(d) {
							return d.LAY_INDEX
						},
					},
					{ field: 'name', title: '用户名称', style: 'justify-content: center;color:#f00;' },
					{ field: 'account', title: '账户名' },
					{ field: 'sex', title: '性 别' },
					// {
					// 	field: 'type',
					// 	title: '用户类型',
					// 	templet: function(d) {
					// 		if (d.type == '1') {
					// 			return '<button class="layui-btn layui-btn-primary layui-border-green layui-btn-xs">检查人员</button>'
					// 	} else if (d.type == '2') {
					// 			return '<button class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">公司用户</button>'
					// 	} else if (d.type == '3') {
					// 			return '<button class="layui-btn layui-btn-primary layui-border-orange layui-btn-xs">政府单位</button>'
					// 	} else {
					// 			return ''
					// 	}
					// 	},
					// },
					{
						title: '区',
						templet: function(d) {
							return d.place_3 ? d.place_3.name : ''
						}
					},
					{
						title: '街 道',
						templet: function(d) {
							return d.place_4 ? d.place_4.name : ''
						}
					},
					{
						title: '社 区',
						templet: function(d) {
							return d.place_5 ? d.place_5.name : ''
						}
					},
					{
						field: 'department',
						title: '部 门',
						templet: function(d) {

							return d.department ? d.department.department : ''
						}
					},
					{
						field: 'job',
						title: '岗 位',
						templet: function(d) {
							return d.job ? d.job.job : ''
						}
					},
					// {
					// 	field: 'is_delete',
					// 	title: '用户状态',
					// 	templet: function(d) {
					// 		if (d.is_delete == '1') {
					// 			return '<input type="checkbox" lay-skin="switch" lay-filter="delctl" data-id="' +
					// 				d.id + '"><span class="userstatus">禁用</span>'
					// 		} else {
					// 			return '<input type="checkbox" lay-skin="switch" lay-filter="delctl" data-id="' +
					// 				d.id + '" checked><span class="userstatus">启用</span>'
					// 		}
					// 	}
					// }, 
					{
						title: '操 作',
						width:290,
						templet: function(d) {
							str=d.role=='community_admin'?'<a class="layui-btn layui-btn-normal layui-btn-sm" lay-event="role">角 色</a>':(d.role=='community_user'?'<a class="layui-btn layui-btn-normal layui-btn-sm" lay-event="role">职 责</a>':'')
							return '<a class="layui-btn layui-btn-normal layui-btn-sm" lay-event="edit">修 改</a><a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="reset">重置密码</a>'+str+'<a class="layui-btn layui-btn-normal layui-btn-sm" lay-event="menu">权  限</a>'
					}
					}
				]
			],
			done: function(response) { //定位当前table视图
				//动态监听表头高度变化，冻结行跟着改变高度
				$('.layui-table-header  tr').resize(function() {
					$('.layui-table-header  tr').each(function(index, val) {
						$($('.layui-table-fixed .layui-table-header table tr')[index])
							.height($(val).height())
					})
				})
				//初始化高度，使得冻结行表头高度一致
				$('.layui-table-header  tr').each(function(index, val) {
					$($('.layui-table-fixed .layui-table-header table tr')[index]).height($(
						val).height())
				})

				//表体部分
				//动态监听表体高度变化，冻结行跟着改变高度
				$('.layui-table-body  tr').resize(function() {
					$('.layui-table-body  tr').each(function(index, val) {
						$($('.layui-table-fixed .layui-table-body table tr')[index])
							.height($(val).height())
					})
				})
				//初始化高度，使得冻结行表体高度一致
				$('.layui-table-body  tr').each(function(index, val) {
					$($('.layui-table-fixed .layui-table-body table tr')[index]).height($(val)
						.height())
				})
				var tableView = this.elem.next()

				//response.data获取后端返  回的JSON格式数据
				$.each(response.data, function(index, item) {

					//逻辑判断
					if (item.is_delete == 0) {
						//改变TR标签内字体颜色
						tableView.find('tbody tr[data-index="' + index + '"]').css('color',
							'#FF0033')
					}
				})
			}
		})
		$('#searchbtn').click(function() {
			dataTable.reload({
				where: { keyword: $('#keywordinput').val() },
				page: { curr: 1 }
			})
		})
		form.on('switch(delctl)', function(data) {
			var id = data.elem.getAttribute('data-id')
			var value = data.elem.checked
			$.ajax({
				type: 'POST',
				headers: { 'X-CSRF-TOKEN': $('input[name="_token"]').val() },
				url: '/admin/user/delctl',
				data: { id, value },
				success: function(res) {
					if (res.code == '1') {
						if (value) {
							layer.msg('启用成功', { icon: 6 })
							$(data.othis).next().html('启 用')
						} else {
							layer.msg('禁用成功', { icon: 6 })
							$(data.othis).next().html('禁 用')
						}
					}
				}
			})
		})
		//监听工具条
		table.on('tool(dataTable)', function(obj) { //注：tool是工具条事件名，dataTable是table原始容器的属性 lay-filter="对应的值"
			var data = obj.data //获得当前行数据
				,
				layEvent = obj.event //获得 lay-event 对应的值
			if (layEvent === 'reset') {
				layer.confirm('确认重置密码吗', { btn: ['确认', '取消'] }, function(index, layero) {
					var id = data.id
					$.ajax({
						type: 'POST',
						headers: {'X-CSRF-TOKEN': $('input[name="_token"]').val()},
						url: '/admin/user/resetpwd',
						data: {id},
						success: function (res) {
							if (res.code == '1') {
								layer.msg(res.msg, {icon: 6})
							}
						}
					})
				}, function(index) {
				})
			} else if (layEvent === 'edit') {
				location.href = '/admin/user/useredit?id=' + data.id
			} else if (layEvent === 'role') {
				console.log(data)
				if(data.role=='community_user'){
					// 社区工作人员
					location.href = '/admin/user/userrole2?id=' + data.id
				}else if(data.role=='community_admin'){
					// 社区管理员
					location.href = '/admin/user/userrole?id=' + data.id
				}else{
					alert('当前用户无法设置角色');
				}
			}else if (layEvent === 'report') {
				location.href = '/admin/user/report?id=' + data.id
			}else if (layEvent === 'menu') {
				location.href = '/admin/user/usermenu?id=' + data.id
			}
		})
	})
</script>
@endsection
